<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>属性操作</title>
    <style>
        .aColor{
            color:blue;
        }
    </style>
</head>
<body>
    <a>点我呀</a>
</body>
<script>
    // 1.setAttribute() 添加属性
    let a = document.getElementsByTagName("a")[0]; //获取到a标签，返回数组，只有一个
    a.setAttribute("href","https://www.baidu.com");

    // 2.getAttribute() 获取属性
    let value = a.getAttribute("href");
    console.log(value);

    // 3. removeAttribute() 删除属性
    a.removeAttribute("href");

    // 4. style属性  添加样式
    a.style.color = "red";  // 相当于在a标签添加style属性

    // 5. className属性 添加指定样式
    // 引入class属性名称
    a.className = "aColor";  // 同时存在，优先显示红色，内嵌优先级高
</script>
</html>